<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>边框各边样式</title>
  <style>
    /* 四个值 */
    p.four {
      border-style: dotted solid double dashed;/*上、右、下、左*/
    }

    /* 三个值 */
    p.three {
      border-style: dotted solid double;
    }

    /* 两个值 */
    p.two {
      border-style: dotted solid;
    }

    /* 一个值 */
    p.one {
      border-style: dotted;
    }
  </style>
</head>
<body>
<p class="four">四种不同的边框样式。</p>
<p class="three">三种不同的边框样式。</p>
<p class="two">两种不同的边框样式。</p>
<p class="one">一种边框样式。</p>
</body>
</html>